<template>
	<div class="comment-list">
		<ul>
			<li><CreateComment></CreateComment></li>
			<CommentItem :commentItem="item" v-for="item in commentList" :key="item.comment_id"></CommentItem>
		</ul>
	</div>
</template>

<script setup lang="ts">
import { inject, type Ref } from "vue";
import CommentItem from "./commentItem.vue";
import CreateComment from "./createComment.vue";
const commentList: Ref<commentItemType[]> = inject("commentList")!;
</script>

<style scoped lang="scss">
.comment-list {
	padding: 3px 20px;
	background-color: #f2f2f5;
}
li:not(:last-of-type) {
	border-bottom: 1px solid $grey;
}
</style>
